
<%@page contentType="text/html;charset=UTF-8"   language="java"  %>
<%
  	String base = request.getContextPath();
	String redirectUrl = request.getParameter("redirectUrl");
%>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>Market Place</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta http-equiv="expires" content="0">
		<jsp:include page="/pages/common/include.jsp" flush="true"/>
		<link rel="stylesheet" href="<%=base%>/resources/css/loginRegis/register.css" />

	</head>

	<body>
	<input id="redirectUrl"  hidden="hidden" value="<%=redirectUrl == null?"null":redirectUrl%>">
		<div id="offCanvasWrapper" class="mui-off-canvas-wrap mui-draggable">
			<!--侧滑菜单部分-->
			<aside id="offCanvasSide" class="mui-off-canvas-left">
				<div id="offCanvasSideScroll" class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<jsp:include page="/pages/common/menu.jsp" flush="true" />
					</div>
				</div>
			</aside>
			<!--主界面部分-->
			<div class="mui-inner-wrap">
				<header class="mui-bar mui-bar-nav" id="headBox">
					<jsp:include page="/pages/common/top.jsp" flush="true" />
				</header>
				<header class="mui-bar mui-bar-nav GreenHeader">
				    <h1 class="mui-title">Registration </h1>
				</header>
				<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper noHead">
					<div class="mui-scroll">
						<div class="registerBox">
							<div class="error">
								<img src="<%=base%>/resources/images/icon/error.png" />
								<span>We were unable to match the usename and password you entered please check your entries  and try again. </span>
							</div>
							<div class="warn-info">* All fields are required</div>
							<div class="commonStyle">
								<h4>Account Details</h4>
								<div class="content">
									<div class="form-group">
										<label>User Name</label>
										<input type="email" id="email" placeholder="Email address only" />
										<span></span>
										<%--<p>Email Address only</p>--%>
									</div>
									<div class="form-group">
										<label>Password</label>
										<input type="password" id="pwd"/>
										<span></span>
									</div>
									<div class="form-group">
										<label>Confirm password</label>
										<input type="password" id="againPwd"/>
										<span></span>
										<p>(Your new password must be between 8 to 20 characters, include letters A-Z and at least one number.)</p>
									</div>
								</div>
							</div>
							<div class="commonStyle">
								<h4>Contact Information</h4>
								<div class="content">
									<div class="form-group">
										<label>Title</label>
										<select id="title">
											<option value="">Please Select</option>
											<option value="MR">Mr.</option>
											<option value="MS">Mrs</option>
											<option value="MISS">Miss</option>
											<option value="Dr">Dr</option>
										</select>
										<span></span>
									</div>
									<div class="form-group">
										<label>Name</label>
										<input type="text" id="name" placeholder="First Name"/>
										<span></span>
										<input type="text" id="surname" placeholder="Last Name"/>
										<span></span>
									</div>
									<div class="form-group DateBirth">
										<label>Date of Birth</label>
										<select id="Month">
											<option value="">Month</option>
											<option value="1">January</option>
											<option value="2">February</option>
											<option value="3">March</option>
											<option value="4">April</option>
											<option value="5">May</option>
											<option value="6">June</option>
											<option value="7">July</option>
											<option value="8">August</option>
											<option value="9">September</option>
											<option value="10">October</option>
											<option value="11">November</option>
											<option value="12">December</option>
										</select>
										<select id="Day">
											<option value="">Day</option>
										</select>
										<span style="display: block"></span>
									</div>
									<div class="form-group">
										<label>Phone No.</label>
										<input type="tel" id="phone" placeholder="12345678" />
										<span></span>
									</div>
									<div class="form-group">
										<label>Octopus Card Number (Optional)</label>
										<input type="text" id="cNumber"/>
										<span></span>
										<P>(Please enter an activated membership Octopus Card Number. Terms and conditions apply.)</P>
									</div>
									<div class="form-group">
										<label>Shopper Type</label>
										<select id="shopType">
											<option value="HOME">Personal</option>
											<option value="BUSINESS">Corporate</option>
										</select>
										<span></span>
									</div>
									<div class="form-group companyBox">
										<label>Company Name</label>
										<input type="text" id="companyName" />
										<span></span>
									</div>
								</div>
							</div>
							<div class="commonStyle delivery-address">
								<h4>Delivery Address</h4>
								<div class="content">
									<%--<div class="description">Please fill your default delivery address below. You can add/change to other address in my profile.</div>--%>
									<div class="form-group">
										<label>Address Name:</label>
										<input type="text" id="nikeName" class="input" placeholder='My Home, My Office, Mother&apos;s Home'/>
										<span></span>
										<label>Address:</label>
										<input type="text" id="floor" class="input" placeholder='Flat / Floor'/>
										<span></span>
							           	<input type="text" id="building" class="input" placeholder='Block / Building'  />
							           	<span></span>
							           	<input type="text" id="estate" class="input" placeholder='Estate' />
							           	<span></span>
							           	<input type="text" id="street" class="input" placeholder='Street ' />
							           	<span></span>
							            <select class="pickerBox" id="Region"></select>
										<span></span>
										<select class="pickerBox" id="District">
											<option>-- Please Select District -- </option>
										</select>
										<span></span>
									</div>
									<div class="form-group">
										<label>May we contact you?</label>
										<p class="isShowDescription">The Dairy Farm Company, Limited 牛奶有限公司 (who owns and operates Market Place by Jasons stores) intends to use and/or transfer your name, phone number, residential/other address and email address to send you marketing materials relating to goods and services provided by (a) Wellcome, Market Place by Jasons, Jasons Food & Living, ThreeSixty, Oliver's The Delicatessen; (b) other business units owned and operated by The Dairy Farm Company, Limited 牛奶有限公司 (including Mannings, Mannings Plus, Mannings Baby, 7-Eleven, GNC and IKEA); and (c) Wellcome's partners. Such goods and services for each of the foregoing shall include the following classes: retail, cosmetics and beauty, health, personal care, toiletries and medical, baby care, maternity care, insurance, financial, music, sports, betting (lucky draw), dining, travel, transportation, banking, electronics, home, household, textile, tele-communication, food and beverage, grocery, office and business supplies, technology, outdoor, furniture, lighting, décor, media (including digital), e-commerce platform and facilitator (including online trading, payment and auctions), and publications. But we cannot do so without your consent. If you do not wish us to use or transfer your personal data for direct marketing purposes mentioned above, please put a "✔" in the box below.</p>
										<div class="check">I do not wish The Dairy Farm Company, Limited 牛奶有限公司 (which owns and operates Market Place by Jasons stores) to use and/or transfer my personal data provided in this form for direct marketing purpose as mentioned above.</div>
									</div>
									<div class="form-group">
										<label>Please enter the word in the picture. (Case Sensitive)</label>
										<input type="text" id="validate" placeholder="" />
										<span></span>
										<div class="validate">
											<img src="http://203.189.170.43/mpj2/Captcha.jpg" />
										</div>
									</div>
								</div>
							</div>
							<div class="btnBox">
								<a href="javascript:void(0)" class="Reload mui-btn mui-btn-block">Reload Picture</a>
								<a class="Register mui-btn mui-btn-block">Register</a>
							</div>
						</div>
						<div class="footer" id="footer">
							<jsp:include page="/pages/common/footer.jsp" flush="true" />
						</div>
					</div>
				</div>
				<!--searchbar-->
				<div class="searchBar">
					<jsp:include page="/pages/common/search.jsp" flush="true" />
				</div>
				
				<div class="rightBottom animate"></div>
			</div>
		</div>
		<script type="text/javascript" src="<%=base%>/resources/js/login-regis/register.js" ></script>
		<script>
		//主界面和侧滑菜单界面均支持区域滚动；
			mui('#offCanvasSideScroll').scroll();
			mui('#offCanvasContentScroll').scroll();
		</script>
	</body>

</html>